import { useGetUserInfoQuery } from "@/api/user";
import { useLayout } from "@/hooks/useLayout";
import { Exception } from "@/layouts/components/Exception";
import { Footer } from "@/layouts/components/Footer";
import { routes } from "@/routes";
import { ProLayout } from "@ant-design/pro-components";
import { PageLoading, SettingDrawer } from "@ant-design/pro-layout";
import { Suspense, useMemo } from "react";
import { useIntl } from "react-intl";
import { Outlet, useLocation } from "react-router-dom";

export default function LayoutWrapper() {
  const { data: currentUser, isLoading } = useGetUserInfoQuery();
  const { layout, setLayout } = useLayout();
  const location = useLocation();
  const intl = useIntl();
  console.log(456456456);
  console.log(routes);
  const matchedRoute = useMemo(
    () => matchRoutes(route.children, location.pathname)?.pop?.()?.route,
    [location.pathname],
  );

  return (
    <ProLayout
      routes={routes}
      //rightContentRender={() => <RightContent />}
      disableContentMargin={false}
      waterMarkProps={{
        content: currentUser?.name,
      }}
      footerRender={() => <Footer />}
      //onPageChange={() => {
      //  // 如果没有登录，重定向到 login
      //  if (loginData?.status !== 'ok' && location.pathname !== '/user/login') {
      //    requestAnimationFrame(() => {
      //      navigate('/user/login')
      //    })
      //  }
      //}}
      formatMessage={intl.formatMessage}
      menuHeaderRender={undefined}
      // 自定义 403 页面
      // unAccessible: <div>unAccessible</div>,
      // 增加一个 loading 的状态
      childrenRender={(children: React.ReactNode) => {
        if (isLoading) return <PageLoading />;
        return (
          <>
            {children}
            {!location.pathname?.includes("/login") && (
              <SettingDrawer
                disableUrlParams
                enableDarkTheme
                settings={layout}
                onSettingChange={(settings) => {
                  setLayout((_value: {}) => {
                    return {
                      ..._value,
                      ...settings,
                    };
                  });
                }}
              />
            )}
          </>
        );
      }}
      {...layout}
    >
      <Exception route={matchedRoute}>
        <Outlet />
      </Exception>
    </ProLayout>
  );
}
